@import "../config/_variables.scss";

.mala-button {
  display: inline-block;
  box-sizing: border-box;
  font-size: 14px;
  color: $light;
  user-select: none;
  cursor: pointer;
  &:hover {
    filter: brightness(1.1);
  }

  &-inner {
    padding: 8px 15px;
    border-radius: 4px;
  }

  // 默认按钮
  &-primary {
    background-color: $primary;
    border: 1px solid $primary;
  }

  // 成功按钮
  &-success {
    background-color: $success;
    border: 1px solid $success;
  }

  // 信息按钮
  &-info {
    background-color: $info;
    border: 1px solid $info;
  }

  // 警告按钮
  &-warning {
    background-color: $warning;
    border: 1px solid $warning;
  }

  // 危险按钮
  &-danger {
    background-color: $danger;
    border: 1px solid $danger;
  }

  // 圆角按钮
  &-round {
    border-radius: 20px;
  }

  // 小尺寸按钮
  &-small {
    padding: 5px 11px;
    font-size: 12px;
  }

  // 大尺寸按钮
  &-large {
    padding: 12px 19px;
    font-size: 16px;
  }

  // 禁用按钮
  &-disabled {
    filter: brightness(.75);
    cursor: not-allowed;
    &:hover {
      filter: brightness(.75);
    }
  }
}